<template>
  <div class="listContainer">
      <swiper  indicator-dots indicator-color="pink" indicator-active-color="green">
          <swiper-item>
              <img src="/static/images/detail/carousel/01.jpg" alt="">
          </swiper-item>
          <swiper-item>
              <img src="/static/images/detail/carousel/02.jpg" alt="">
          </swiper-item>
          <swiper-item>
              <img src="/static/images/detail/carousel/03.jpg" alt="">
          </swiper-item>
          <swiper-item>
              <img src="/static/images/detail/carousel/04.jpg" alt="">
          </swiper-item>
      </swiper>
      <div>
				<listArr v-for='(item,index) in list_data' :key='index' :index='index' :item="item"></listArr>
			</div>
  </div>
</template>

<script>
import listArr from '@/components/listArr'
export default {
  components: {
		listArr
  },

  data () {
    return {
			list_data:''
    }
  },
	beforeMount(){
		this.$store.dispatch('getList')
		this.list_data=this.$store.state.listArray.list_data
		//console.log(this.list_data[0])
	}
}
</script>

<style>
 .listContainer swiper{
        width: 100%;
        height: 400rpx;
    }
    .listContainer swiper img{
        width: 100%;
        height: 100%;
    }
</style>
